<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
 
<h:head>
<style type="text/css">
    body {
       margin:0;
       padding: 0;
       background-color: #CEE3F6;
    }
   .ui-stack {
		bottom: 28px;
		right: 40px;
	}
</style>

</h:head>
<h:body>
 
 <h:form>

<p:growl id="growl" showDetail="true"/>  
  
  <p:toolbar>  
    <p:toolbarGroup align="left">  
        <p:commandButton type="button" value="New" icon="ui-icon-document" />  
  
        <p:commandButton type="button" value="Open" icon="ui-icon-folder-open"/>  
  
        <p:separator />  
  
        <p:commandButton type="button" title="Save" icon="ui-icon-disk"/>  
        <p:commandButton type="button" title="Delete" icon="ui-icon-trash"/>  
        <p:commandButton type="button" title="Print" icon="ui-icon-print"/>  
    </p:toolbarGroup>  
  
    <p:toolbarGroup align="right">  
        <p:menuButton value="Options">  
            <p:menuitem value="Home" url="http://www.primefaces.org" />  
            <p:menuitem value="ShowCase"  
                        url="http://www.primefaces.org/showcase" />  
            <p:menuitem value="TouchFaces"  
                        url="http://www.primefaces.org/showcase/touch" />  
        </p:menuButton>  
    </p:toolbarGroup>  
  
  </p:toolbar>  
 
 <p:dialog header="Dialog1" widgetVar="dlg" maximizable="true" minimizable="true" height="100px">  
      <h:panelGrid columns="2">  
            <h:outputText value="Nome: *" />   
            <p:inputText value="#{CaptchaMB.nome}" id="txt1"  label="Nome1"/>  
        </h:panelGrid>  
  
        <p:commandButton value="Save" action="#{CaptchaMB.salvar}" update="growl"/>  
</p:dialog> 

 <p:dialog header="Dialog2" widgetVar="dlg1" maximizable="true" minimizable="true" height="100px">  
    <h:outputText value="Pagina 2" />  
</p:dialog> 

 <p:dialog header="Dialog3" widgetVar="dlg2" maximizable="true" minimizable="true" height="100px">  
    <h:outputText value="Pagina 3" />  
</p:dialog> 
 
 	<p:dock>
		<p:menuitem value="Home" icon="images/home.png" onclick="dlg.show()" url="#" />
		<p:menuitem value="Music" icon="images/music.png" onclick="dlg1.show()" url="#" />
		<p:menuitem value="Video" icon="images/video.png" onclick="dlg2.show()" url="#"/>
		<p:menuitem value="Email" icon="images/email.png" url="#"/>
		<p:menuitem value="Link" icon="images/link.png" url="#"/>
		<p:menuitem value="RSS" icon="images/rss.png" url="#"/>
		<p:menuitem value="History" icon="images/history.png" url="#"/> 	
 	</p:dock>
 
 	   <p:stack icon="images/home.png">
                <p:menuitem value="Aperture" icon="images/music.png" url="#" />
                <p:menuitem value="Photoshop" icon="images/video.png" url="#"/>
                <p:menuitem value="Coda" icon="images/email.png" url="#"/>
                <p:menuitem value="Safari" icon="images/link.png" url="#" />
                <p:menuitem value="Finder" icon="images/rss.png" url="#" />
        </p:stack>
 
 
  <p:panel header="Growl">  
        <h:panelGrid columns="2">  
            <h:outputText value="Your Name: *" />   
            <p:inputText value="#{CaptchaMB.nome}" id="txt" required="true" label="Nome"/>  
        </h:panelGrid>  
  
        <p:commandButton value="Save" action="#{CaptchaMB.salvar}" update="growl"/>  
    </p:panel>  
 </h:form>
</h:body>
</html>